<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>菜单管理</title>
    <jsp:include page="/assets/common-css.jsp"/>
    <link rel="stylesheet" type="text/css" href="<%=request.getContextPath()%>/assets/vendors/custom/jstree-plugin/jstree-plugin.css" />
    <link rel="stylesheet" type="text/css" href="<%=request.getContextPath()%>/assets/vendors/custom/mulitselect/css/multi-select.css" />
    <link rel="stylesheet" href="<%=request.getContextPath()%>/assets/vendors/custom/swiper/swiper.min.css">
    <link rel="stylesheet" type="text/css" href="<%=request.getContextPath()%>/menu/css/menu-listPage.css" />
    <script>
        var allRole = ${allRole == null ? false : allRole};
    </script>
    <style>
    .swiper-container {
        width: 100%;
        height: 70px;
    }
    </style>
</head>
<body>
    <div class="m-portlet">
        <div class="m-portlet__body">
            <div class="row">
                <div class="col-lg-4 m-border-right">
                    <div class="m-input-icon m-input-icon--left m--margin-bottom-10">
                        <input id="search" type="text" class="form-control m-input" placeholder="输入名称">
                        <span class="m-input-icon__icon m-input-icon__icon--left">
                            <span>
                                <i class="fa fa-search"></i>
                            </span>
                        </span>
                    </div>
                    <div class="tab-content" id="menutree-div">
                        <div id="tree" class="tree"></div>
                    </div>
                </div>
                <div class="col-lg-8 m-border-left">
                    <div class="m-portlet__body user-div">
                        <div class="m-portlet__head user-header">
                            <div class="m-portlet__head-caption">
                                <div class="m-portlet__head-title">
                                    <h3 class="m-portlet__head-text">
                                        菜单角色配置<span id="menuName"></span>
                                    </h3>
                                </div>
                            </div>
                        </div>
                        <div class="col-sm-12 role-select">
                            <select id='role-selected-option' multiple='multiple' style="display: none;">
                            </select>
                        </div>
                    </div>
            </div>
        </div>
    </div>

<jsp:include page="/assets/common-js.jsp" /><script src="<%=request.getContextPath()%>/assets/vendors/custom/swiper/swiper.min.js"></script>
<script src="<%=request.getContextPath()%>/assets/vendors/custom/jstree-plugin/jstree-plugin.js"></script>
<script src="<%=request.getContextPath()%>/assets/vendors/custom/mulitselect/js/jquery.multi-select.js"></script>
<script src="<%=request.getContextPath()%>/assets/vendors/custom/quicksearch/js/jquery.quicksearch.js"></script>
<script src="<%=request.getContextPath()%>/menu/js/menu-listPage.js"></script>
</body>
<script id="select-li" type="text/html">
    <li class="list-group-item select-{{d.id}}">
        <span class="label label-default label-pill pull-right delete-btn" data-id="{{d.id}}">x</span>
        <i class="la la-align-left m--font-brand"></i> {{d.title}}
    </li>
</script>
<script id="editMenuTemplate" type="text/html">
    <div class="m-form m-form--fit m-form--label-align-right layer-div layui-form">
        <div class="m-portlet__body">
            <input type="hidden" id="edit_menu_id">
            <input type="hidden" id="edit_menu_fatherid">
            <input type="hidden" id="edit_menu_sort">
            <div class="form-group m-form__group row" id="dept_id_div">
                <label class="col-lg-3 col-form-label">
                    菜单名称 <font color="red">*</font>
                </label>
                <div class="col-lg-8">
                    <input type="text" required lay-verify="required" class="form-control"
    id="edit_menu_name" placeholder="请输入菜单名称" lay-verType="tips">
                </div>
            </div>
            <div class="form-group m-form__group row">
                <label class="col-lg-3 col-form-label">
                    菜单URL
                </label>
                <div class="col-lg-8">
                    <input type="text" class="form-control" id="edit_menu_url"  placeholder="请输入菜单URL">
                </div>
            </div>
            <div class="form-group m-form__group row">
                <label class="col-lg-3 col-form-label">
                    菜单图标
                </label>
                <div class="col-lg-8">
                    <input type="text" class="form-control" id="edit_menu_icon"  placeholder="请输入菜单图标，支持fontawesome、lineawesome" lay-verType="tips">
                </div>
            </div>
            <div class="form-group m-form__group row">
                <label class="col-lg-3 col-form-label">
                    描述信息
                </label>
                <div class="col-lg-8">
                    <textarea id="edit_menu_description" class="form-control" rows="3" cols="3"></textarea>
                </div>
            </div>
            <div class="form-group m-form__group row">
                <label class="col-lg-3 col-form-label">
                    菜单位置
                </label>
                <div class="col-lg-8">
                    <select id="edit_menu_showLevel" class="form-control m-bootstrap-select m_selectpicker">
                        <option value="0" selected>不显示</option>
                        <option value="1">左侧</option>
                        <option value="2">头部</option>
                        <option value="3">手机端路由</option>
                    </select>
                </div>
            </div>
        </div>
        <div class="m-portlet__foot m-portlet__foot--fit">
            <div class="m-form__actions m-form__actions">
                <div class="row">
                    <div class="col-lg-12 ml-lg-auto">
                        <button class="btn btn-secondary m--pull-right edit_cancle" style="border-radius: 25px">
                            取消
                        </button>
                        <button id="edit_menu_yes" lay-submit lay-filter="save_menu" class="btn btn-brand m--pull-right yes-btn">
                            确定
                        </button>
                    </div>
                </div>
            </div>
        </div>
    </div>
</script>
<script id="roleSelectOption" type="text/html">
    {{#  layui.each(d.list, function(index, item){ }}
        <option value='{{item.id}}' {{item.selected}}>{{item.name}}</option>
    {{#  }); }}
</script>

</html>